<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--1.引入bootstrap样式框架；-->
    <link rel="stylesheet" href="../bootstrap/css/bootstrap.min.css">

    <!--2.引入angularJS分页样式的框架；-->
    <link rel="stylesheet" href="../angularjs/pagination.css">

    <link rel="stylesheet" href="../layer/theme/default/layer.css">

    <!--3.引入bootstrap中的Jquery框架；-->
    <script src="../bootstrap/js/jquery.min.js"></script>
    <!--4.引入bootstrap中的Js框架；-->
    <script src="../bootstrap/js/bootstrap.min.js"></script>

    <!--5.引入AngularJS的JS框架-->
    <script src="../angularjs/angular.min.js"></script>

    <!--6.引入AngularJS分布的JS框架-->
    <script src="../angularjs/pagination.js"></script>

    <script src="../layer/layer.js"></script>

    <script src="../angularjs/angular-route.min.js"></script>
    <script src="../angularjs/angular-animate.min.js"></script>

</head>
<body ng-app="obloApp"    ng-controller="obloCtrl">

<!--最上方小导航栏-->
<div ng-include=" 'obtop.html' "></div>

<!--主要导航栏-->
<div class="navbar navbar-default " role="navigation" style="background-color: white;height: 80px;margin-bottom: 0px;padding-top: 15px">
    <!--navbar-fixed-top-->
    <div class="navbar-header" style="padding-left: 30px;">
        <a class="navbar-brand" href="#" style="padding-top: 0px;padding-left: 150px;">
            <img alt="Brand" src="../imgs/oblogo.png" width="150" height="45">
        </a>

        <a class="navbar-brand" href="#" style="padding-top: 8px">
            <img alt="Brand" src="../imgs/ipv6.png" width="50" height="30">
        </a>
    </div>

    <ul class="nav navbar-nav navbar-right" style="font-size: 15px;font-family:'黑体';padding-right: 150px">
        <li ><a href="../onlinebank.html">首页</a></li>
        <li ><a href="#!/login2">产品中心</a></li>
        <li ><a href="#!/login">安全保障</a></li>
        <li ><a href="obtransfer.html">账户转账</a></li>
        <li ><a href="obdetail.html">账户详情</a></li>&nbsp;&nbsp;&nbsp;&nbsp;
    </ul>
</div>

<div class="">

    <div class="panel panel-primary">

        <!--<div class="panel-heading">-->
            <!--&lt;!&ndash;<h1>网上银行</h1>&ndash;&gt;-->

        <!--</div>-->
        <div style="text-align: center">
            <h1>用户登录</h1>

        </div>

        <div class="panel-body">
            <div class="col-md-9 col-md-offset-1">
                <form >

                    <div class="form-group">
                        <div class="form-horizontal">
                            <label for="obUname" class="control-label col-md-2">用户名</label>
                            <div class="input-group">
                                <span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
                                <input name="obUname" id="obUname" ng-model="form.obUname" class="form-control" placeholder="请输入用户名" maxlength="30"
                                       type="text"/><span id="yhm"></span>
                            </div>
                        </div>

                        <br>
                        <div class="form-horizontal">
                            <label for="obUpwd" class="control-label col-md-2">密码</label>
                            <div class="input-group">
                                <span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
                                <input name="obUpwd" id="obUpwd" ng-model="form.obUpwd" class="form-control" placeholder="请输入密码" maxlength="30"
                                       type="password"><span id="mm"></span>
                            </div>
                        </div>


                        <br>
                        <div class="form-group">
                            <div class="form-group">
                                <input class="btn btn-primary col-sm-offset-2 col-md-6" id="submit"
                                       ng-click="login()"     value="立&nbsp;&nbsp;即&nbsp;&nbsp;登&nbsp;&nbsp;录" type="button">
                            </div>
                            <div class="form-group">
                                <a class="btn btn-warning col-sm-offset-2 col-md-2" id="submit1"
                                   href="register.html" type="button">注册</a>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>

        <div class="panel-footer text-right">
            订单新系统
        </div>

    </div>

</div>

<script>
    layerindex=-1;
    var app = angular.module('obloApp',['pagination','ngRoute']);    //定义一个模块； cityApp

    app.controller("obloCtrl",function ($scope, $http) {    //定义一个控制器； cityCtrl  ,  $http 调用接口！  http://localhost:8080/citys/list.action
        $scope.id=0;

        $scope.form={
            obUname:"",
            obUpwd:""
        }
        var sessionStorage = window.sessionStorage;
        $scope.login=function () {

            $http.post("http://localhost:12000/onli/ob/login",$scope.form

            ).success(function (data) {
                console.log(data.msg)
                if(data.code==200){
                    window.sessionStorage.setItem("obid",data.data.obId)
                    console.log(data.data)
                    //alert(data.data.obId)

                    layer.close(layerindex);
                    layer.msg("网银登录成功",{icon:6,title:"系统提示："});

                    window.location.href="/onlinebank.html";
                }else{
                    layer.close(layerindex);
                    layer.msg("登录失败",{icon:6,title:"系统提示："});
                    $scope.form={
                        obUname:"",
                        obUpwd:""
                    }
                }
            })
        }
    });

    $(function () {

        $("#uname").blur(function () {

            var name = $("#uname").val();
            //console.log(s)
            if (name == null || name == "") {
                $("#yhm")[0].innerHTML = "<span style='color:red;font-size:14px;'>用户名不能为空！</span>";

                $("#uname").css("border", "2px red solid");

                $("#uname").focus()
                $("#submit").attr("disabled",true);
                return false;
            } else {
                $("#yhm")[0].innerHTML =""
                $("#submit").attr("disabled",false);
                $("#uname").css("border", "none");
                return true;
            }
        })

        $("#upwd").blur(function () {
            var pwd=$("#upwd").val();

            if(pwd==null||pwd==""){
                $("#mm")[0].innerHTML="<span style='color:red;font-size:14px;'>密码不能为空！</span>";

                $("#upwd").css("border","2px red solid");
                $("#upwd").focus()
                $("#submit").attr("disabled",true);
                return false;
            }else{
                $("#mm")[0].innerHTML =""
                $("#submit").attr("disabled",false);
                $("#upwd").css("border","none");
                return true;
            }
        })

    });

</script>
</body>
</html>